<template>
	<view class="wanl-withdraw">
		<view class="edgeInsetTop"> </view>
		<text class="wanl-gray-light">金币兑换消费券</text>
		
		<view class="padding-bj bg-white money">
			<view class="margin-tb-bj price">
				<view class="symbol">
					<text>￥</text>
				</view>
				<input type="digit"  focus @input="coinInput" v-model="coin"/>
				<view class="text-lg wanl-gray-light" @tap="emptyInput">
					<text class="wlIcon-shibai"></text>
				</view>
			</view>
			<view class="solid-top padding-top-bj">
				<text class="wanl-gray-light">可用金币零钱</text>
				<text class="wanl-gray-light margin-lr-xs text-price">{{usercoin}}</text>
				<text class="text-orange" v-if="usercoin > 0" @tap="coinAll">全部</text>
			</view>
		</view>
		
		<view class="padding-bj bg-white money">
			<view class="margin-tb-bj price">
				<view class="symbol">
					<text>￥</text>
				</view>
				<input type="digit"  @input="reimInput" v-model="reim"/>
				<view class="text-lg wanl-gray-light" @tap="emptyInput">
					<text class="wlIcon-shibai"></text>
				</view>
			</view>
			<view class="solid-top padding-top-bj">
				<text class="wanl-gray-light">可用消费券零钱</text>
				<text class="wanl-gray-light margin-lr-xs text-price">{{userreim}}</text>
				<text class="text-orange" v-if="userreim > 0" @tap="reimAll">全部</text>
			</view>
		</view>
		
		<view class="padding-bj margin-top">
			<!-- 1.0.5升级 -->
			<button class="mix-btn wanl-bg-redorange" :loading="loading" :disabled="loading" @tap="exchange">兑换</button>
		</view>
	</view>
</template>

<script>
import jssdk from '../../../common/libs/jssdk';
	export default {
		data() {
			return {
				bankData: null,
				usercoin: 0,
				userreim: 0,
				reim:null,
				coin:null,
				loading: false
			};
		},
		onLoad() {
			this.loadData();
		},
		methods: {
			async loadData() {
				await uni.request({
					url: '/wanlshop/user/refresh',
					method: 'POST',
					success: res => {
						//console.log(JSON.stringify(res.data));
						this.userreim = res.data.userinfo.reim;
						this.usercoin = res.data.userinfo.coin;
						//更新全局金额
						//this.setMoney(res.data.money);
						
					}
				});
			},
			async exchange(){
				// 1.0.5升级 修复针对多次点击
				if(this.loading) return;
				this.loading = true;
				// 1.0.6升级
				let coin = parseInt(this.coin);
				let usercoin = parseInt(this.usercoin);
				let reim = parseInt(coin / 1000);
				if(coin <= 0){
					this.$wanlshop.msg('请填写正确的兑换金币数量');
					return;
				}
				if(coin > usercoin){
					this.$wanlshop.msg('兑换金币不能超过 ' + usercoin + ' 个');
					return;
				}
				await uni.request({
					url: '/wanlshop/ddp/exchangecr',
					method: 'POST',
					data: {
						coin: coin,
						reim: reim
					},
					success: res => {
						//this.setMoney(res.data);
						// 1.0.5升级
						this.loading = false;
						// 跳转成功
						this.$wanlshop.to('/pages/page/success?type=exchange');
					}
				});
			},
			setMoney(money){
				this.usermoney = money;
				this.$store.commit('user/setUserInfo', {money: money});
			},
			coinInput(e){
				this.coin = e.target.value;
				this.reim = parseInt(this.coin / 1000);
			},
			reimInput(e){
				this.reim = e.target.value;
				this.coin = this.reim * 1000;
			},
			emptyInput(){
				this.coin = 0;
				this.reim = 0;				
			},
			coinAll(){
				this.coin = this.usercoin;
				this.reim = parseInt(this.coin / 1000);
			},
			reimAll(){
				this.reim = this.userreim;
				this.coin = this.reim * 1000;
			}
		}
	}
</script>

<style>
	
	.wanl-withdraw .money .symbol{
		font-size: 60rpx;
		margin-right: 10rpx;
	}
	
	.wanl-withdraw .money .price{
		display: flex;
		align-items: center;
	}
	.wanl-withdraw .money .price input{
		/* #ifdef MP */
		height: 100rpx;
		min-height: 100rpx;
		/* #endif */
		width: 100%;
		font-size: 100rpx;
	}
	
	.wanl-withdraw .bank{
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #ffffff;
		padding: 20rpx 25rpx;
	}
	.wanl-withdraw .bank image{
		width: 100rpx;
		height: 100rpx;
		margin-right: 25rpx;
	}
	.wanl-withdraw .bank .content{
		flex: 1;
	}
	.wanl-withdraw .bank .action{
		
	}
</style>
